import {
  apiGetBusinessClassificationSave,
  apiGetBusinessClassificationUpdate,
} from '@/services/type';
import {
  ModalForm,
  ModalFormProps,
  ProForm,
  ProFormText,
  ProFormUploadButton,
} from '@ant-design/pro-components';
import { message } from 'antd';
import { useState } from 'react';
import React from 'react/index';

export const EditModal: React.FC<{
  record?: any;
  onFinish?: Function;
  children: ModalFormProps['trigger'];
}> = ({ children, record, onFinish }) => {
  const [open, setOpen] = useState(false);

  return (
    <ModalForm
      title={'修改'}
      trigger={children}
      initialValues={record}
      modalProps={{
        destroyOnClose: true,
        maskClosable: false,
      }}
      onOpenChange={setOpen}
      layout="horizontal"
      grid={true}
      onFinish={async (values) => {
        const res = await (record
          ? apiGetBusinessClassificationUpdate
          : apiGetBusinessClassificationSave)(values);
        if (res.code === 0) {
          message.success(record ? '修改成功' : '新增成功');
          onFinish?.();
          return true;
        } else {
          message.error(res.message);
        }

        return false;
      }}
    >
      <ProForm.Item hidden name="id" />
      <ProFormText
        name="name"
        label="名称"
        required
        rules={[{ required: true, whitespace: true, message: '请输入名称' }]}
      />
      <ProFormText
        name="sort"
        label="排序"
        required
        fieldProps={{ type: 'number' }}
        rules={[{ required: true, whitespace: true, message: '请输入排序' }]}
      />
      <ProFormUploadButton
        required
        label="图片"
        action="https://www.mocky.io/v2/5cc8019d300000980a055e76" // 替换为你的上传API地址
        max={5} // 最多上传3张图片
        name="file" // 上传文件的参数名
      />
    </ModalForm>
  );
};
